<?php /*a:3:{s:73:"D:\phpstudy_pro\WWW\www.xnadmin.site\app\admin\view\statistic\editor.html";i:1620265807;s:61:"D:\phpstudy_pro\WWW\www.xnadmin.site\app\admin\view\main.html";i:1588058566;s:67:"D:\phpstudy_pro\WWW\www.xnadmin.site\app\admin\view\breadcrumb.html";i:1588058566;}*/ ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title><?php echo xn_cfg('base.sys_name'); ?></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <script>
        //全局上传文件端口
        var UPLOAD_FILE_URL = "<?php echo url('upload_files/upload'); ?>";
        //全局选择文件端口
        var SELECT_FILE_URL = "<?php echo url('upload_files/select'); ?>";
    </script>
    <script src="/static/admin/js/jquery-2.0.0.min.js"></script>
    <script src="/static/admin/js/common.js"></script>
    <script src="/static/admin/js/upload.js"></script>
    <script src="/static/admin/js/webuploader.min.js"></script>
    <link rel="stylesheet" href="/static/admin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/admin/style/layuiAdmin.css" media="all">
    <link rel="stylesheet" href="/static/admin/style/base.css" media="all">
    
</head>
<body>

<?php if(!empty($breadcrumb)): ?>
<div class="layui-card layadmin-header">
    <div class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
        <a href="<?php echo url('admin/index/home'); ?>">主页</a>
        <?php if(is_array($breadcrumb) || $breadcrumb instanceof \think\Collection || $breadcrumb instanceof \think\Paginator): if( count($breadcrumb)==0 ) : echo "" ;else: foreach($breadcrumb as $key=>$vo): ?>
        <a><cite><?php echo htmlentities($vo['title']); ?></cite></a>
        <?php endforeach; endif; else: echo "" ;endif; ?>
    </div>
</div>
<?php endif; ?>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">全部</div>
                    <div class="layui-card-body layui-text">
                        <div id="my_chart_all" style="width: 100%;height: 300px;"></div>
                    </div>
                </div>
            </div>
            <div class="layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">今天</div>
                    <div class="layui-card-body layui-text">
                        <div id="my_chart_today" style="width: 100%;height: 300px;"></div>
                    </div>
                </div>
            </div>
            <div class="layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">昨天</div>
                    <div class="layui-card-body layui-text">
                        <div id="my_chart_yesterday" style="width: 100%;height: 300px;"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class=" layui-card-header layuiadmin-card-header-auto">
            <form class="layui-form" method="get">
                <input type="hidden" name="bcid" value="<?php echo input('bcid'); ?>"><!--保留当前位置的bcid参数-->
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <input type="text" name="start" value="<?php echo htmlentities($param['start']); ?>" class="layui-input" id="start">
                    </div>
                    <div class="layui-inline">
                        <input type="text" name="end" value="<?php echo htmlentities($param['end']); ?>" class="layui-input" id="end">
                    </div>
                    <div class="layui-inline">
                        <button class="layui-btn">
                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                        </button>
                    </div>
                </div>
            </form>
        </div>
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <!-- <div class="layui-card-header">段落统计</div> -->
                    <div class="layui-card-body layui-text">
                        <div id="my_chart" style="width: 100%;height: 450px;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<script src="/static/admin/layui/layui.all.js"></script>
<script src="/static/admin/js/admin.js"></script>

<script src="/static/admin/js/echarts.js"></script>
<script>
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        laydate.render({
            elem: '#start' //指定元素
        });
        laydate.render({
            elem: '#end' //指定元素
        });
    });

    var myChartAll = echarts.init(document.getElementById('my_chart_all'));
    var option_all = {
        title: {
            text: '全部',
            // subtext: '纯属虚构',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left',
        },
        series: [
            {
                type: 'pie',
                radius: '50%',
                data: JSON.parse('<?php echo htmlentities($data_all); ?>'.replace(/&quot;/g,'"')),
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    myChartAll.setOption(option_all);

    var myChartToday = echarts.init(document.getElementById('my_chart_today'));
    var option_today = {
        title: {
            text: '今天',
            // subtext: '纯属虚构',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left',
        },
        series: [
            {
                type: 'pie',
                radius: '50%',
                data: JSON.parse('<?php echo htmlentities($data_today); ?>'.replace(/&quot;/g,'"')),
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    myChartToday.setOption(option_today);

    var myChartYesterday = echarts.init(document.getElementById('my_chart_yesterday'));
    var option_yesterday = {
        title: {
            text: '昨天',
            // subtext: '纯属虚构',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left',
        },
        series: [
            {
                type: 'pie',
                radius: '50%',
                data: JSON.parse('<?php echo htmlentities($data_yesterday); ?>'.replace(/&quot;/g,'"')),
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    myChartYesterday.setOption(option_yesterday);

    var myChart = echarts.init(document.getElementById('my_chart'));
    var data_users = JSON.parse('<?php echo htmlentities($data_users); ?>'.replace(/&quot;/g,'"'));
    var date_list = JSON.parse('<?php echo htmlentities($date_list); ?>'.replace(/&quot;/g,'"'));
    var data = JSON.parse('<?php echo htmlentities($data); ?>'.replace(/&quot;/g,'"'));
    var series = [];
    $(data).each(function(index,obj){
        var value = [];
        for (let i in obj.value){
            value.push(obj.value[i]);
        }
        series.push({
                name: obj.name,
                type: 'line',
                areaStyle: {},
                data: value
            })
    });
    var option = {
        title: {
            text: '段落统计'
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    backgroundColor: '#6a7985'
                }
            }
        },
        legend: {
            data: data_users
        },
        toolbox: {
            feature: {
                saveAsImage: {}
            }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: [
            {
                type: 'category',
                boundaryGap: false,
                data: date_list
            }
        ],
        yAxis: [
            {
                type: 'value'
            }
        ],
        series: series
    };
    myChart.setOption(option);


</script>

</body>
</html>